<template>
	<view>
		<u-form :model="form" ref="uForm" labelWidth="250">
			<view class="u-p-x-30">
				<u-form-item label="个人姓名" prop="name">
					<u-input v-model="form.name" placeholder="请填写个人姓名" />
				</u-form-item>
				<u-form-item label="手机号码" prop="mobile_no">
					<u-input v-model="form.mobile_no" placeholder="请填写手机号码" />
				</u-form-item>
				<u-form-item label="证件有效期类型" prop="cert_date_type">
					<u-radio-group v-model="form.cert_date_type">
						<u-radio :name="1"> 长期有效 </u-radio>
						<u-radio :name="0"> 非长期有效 </u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="证件开始日期" prop="cert_begin_date">
					<u-input v-model="form.cert_begin_date" type="select" @click="certBeginDateShow = true"
						placeholder="请选择证件有效期开始日期" />
				</u-form-item>
				<u-form-item label="证件结束日期" prop="cert_end_date" v-if="form.cert_date_type === 0">
					<u-input v-model="form.cert_end_date" type="select" @click="certEndDateShow = true"
						placeholder="请选择证件有效期结束日期" />
				</u-form-item>
				<u-form-item label="证件类型" prop="cert_type_text">
					<u-input v-model="form.cert_type_text" type="select" @click="certTypeShow = true" placeholder="请选择证件类型"/>
				</u-form-item>
				<u-form-item label="证件号码" prop="cert_no">
					<u-input v-model="form.cert_no" placeholder="请填写证件号码" />
				</u-form-item>
				<u-form-item label="个人国籍" prop="cert_nationality_text" v-if="form.cert_type">
					<u-input v-model="form.cert_nationality_text" type="select" @click="countriesShow = true" placeholder="请选择国籍"/>
				</u-form-item>
				<!-- <u-form-item label="证件正面照片" prop="cert_img1">
					<u-upload @on-choose-complete="uploadSuccess" index="cert_img1"
						:file-list="log.cert_img1 ? [{url:log.cert_img1}] : []" ref="uUpload1" max-count="1" width="150"
						height="150" :max-size="2 * 1024 * 1024" :show-tips="false" @on-oversize="oversize">
					</u-upload>
				</u-form-item>
				<u-form-item label="证件反面照片" prop="cert_img2">
					<u-upload @on-choose-complete="uploadSuccess" index="cert_img2"
						:file-list="log.cert_img2 ? [{url:log.cert_img2}] : []" ref="uUpload2" max-count="1" width="150"
						height="150" :max-size="2 * 1024 * 1024" :show-tips="false" @on-oversize="oversize">
					</u-upload>
				</u-form-item> -->
			</view>
		</u-form>
		<view class="text-center u-p-y-30">
			<dy-button width="576rpx" size="default" @click="submit">提交</dy-button>
		</view>
		<u-select v-model="certTypeShow" :list="certTypeList" label-name="name" value-name="id"
			@confirm="certTypeConfirm"></u-select>
		<u-select v-model="countriesShow" :list="nationalityList" label-name="name" value-name="id"
			@confirm="countriesConfirm"></u-select>
		<u-picker mode="time" v-model="certBeginDateShow" @confirm="certBeginDateChange" :params="{
					year: true,
					month: true,
					day: true,
					hour: false,
					minute: false,
					second: false
				}"></u-picker>
		<u-picker mode="time" v-model="certEndDateShow" @confirm="certEndDateChange" :params="{
					year: true,
					month: true,
					day: true,
					hour: false,
					minute: false,
					second: false
				}"></u-picker>
	</view>
</template>

<script>
	import { mapActions } from 'vuex'
	import { BaseCenterApi } from '@/api/serves.js'
	export default {
		data() {
			return {
				certTypeShow: false, // 证件类型
				certBeginDateShow: false, // 证件开始日期
				certEndDateShow: false, // 证件结束日期
				countriesShow: false, // 国籍列表显示
				certTypeList: [], // 证件类型
				nationalityList: [], // 国际列表
				log: {}, //
				state:0, // 审核状态 0 可以提交 1 不可以提交
				form: {
					name: '', // 持卡人姓名
					mobile_no:'', // 手机号码
					cert_begin_date: '', // 证件有效期开始日期
					cert_date_type: 1, // 证件有效期类型,1=长期有效,0=非长期
					cert_end_date: '', // 证件有效期结束日期
					cert_img1: '', // 证件照片1
					cert_img2: '', // 证件照片2
					cert_no: '', // 证件号码
					cert_type_text: '', // 证件类型
					cert_nationality:'', // 国籍
					cert_nationality_text:'', // 国籍
					cert_type: null, // 证件类型：0:身份证;1:护照;2:军官证;3:士兵证;4:回乡证;5:户口本;6:外国护照;7:其他;8:暂住证;9:警官证;10:文职干部证;11:港澳台同胞通行证;13:外国人居留证;14:台胞证;15:港澳台居住证
				},
				rules: {
					name: [{
						required: true,
						message: '请输入持卡人姓名',
						trigger: ['blur', 'change']
					}],
					mobile_no: [{
						required: true,
						message: '请输入手机号码',
						trigger: ['blur', 'change']
					}],
					cert_no: [{
						required: true,
						message: '请输入证件号码',
						trigger: ['blur', 'change']
					}],
					cert_img1: [{
						required: true,
						message: '请上传证件照正面照',
						trigger: ['blur', 'change']
					}],
					cert_img2: [{
						required: true,
						message: '请上传证件照反面照',
						trigger: ['blur', 'change']
					}],
					cert_begin_date: [{
						required: true,
						message: '请输入证件有效期开始日期',
						trigger: ['blur', 'change']
					}],
					cert_nationality_text: [{
						required: true,
						message: '请选择国籍',
						trigger: ['blur', 'change']
					}],
					cert_end_date: [{
						validator: (rule, value, callback) => {
							if (this.form.cert_date_type == 0 && !value) {
								callback(new Error("请选择法人证件结束日期"));
							} else {
								callback();
							}
						}
					}]
				},
			};
		},
		methods:{
			...mapActions({
				upload: 'user/upload'
			}),
			certBeginDateChange(e) {
				this.form.cert_begin_date = e.year + '-' + e.month + '-' + e.day
			},
			certEndDateChange(e) {
				this.form.cert_end_date = e.year + '-' + e.month + '-' + e.day
			},
			uploadSuccess(files, name) {
				this.upload(files).then(res => {
					if (res.length > 0) {
						this.form[name] = this.$_BASE_IMG_API + res[0]
						console.log(this.form);
					}
				})
			},
			certTypeConfirm(data) {
				console.log(data);
				this.form.cert_type_text = data[0].label
				this.form.cert_type = data[0].value
			},
			countriesConfirm(data) {
				console.log(data);
				this.form.cert_nationality_text = data[0].label
				this.form.cert_nationality = data[0].value
			},
			submit() {
				console.log(this.form);
				if(this.state == 1) return this.$u.toast('审核中及审核通过后不能修改认证信息')
				this.$refs.uForm.validate(valid => {
					if (valid) {
						console.log('验证通过');
						uni.showLoading()
						BaseCenterApi.submitRealName(this.form).then(res => {
							uni.hideLoading()
							this.$u.toast(res.msg)
							if (res.code === 1) {
								uni.navigateBack()
							}
						})
					}
				});
			},
			certDetail() {
				BaseCenterApi.realName().then(res => {
					if (res.code == 1) {
						this.nationalityList = res.data.countriesList
						this.state = res.data.state
						this.certTypeList = res.data.cart_type
						
						if(res.data.user){
							this.form = {...this.form,...res.data.user}
							this.form.cert_begin_date = res.data.user.cert_begin_date_text
							this.form.cert_end_date = res.data.user.cert_end_date_text
							this.form.areaName = res.data.user.prov_text + res.data.user.city_text
							this.form.bank_code_id = res.data.user.bank_id
							
							this.log = res.data.user
						}
					}
				})
			},
		},
		onLoad(options) {
			console.log(options);
			this.certDetail()
		}
	}
</script>

<style lang="scss">

</style>
